<template>
  <div class="dbl-input">
    <div class="input-item">
      <div
        class="radio-box"
        :style="'width:' + radioItemWidth + ';'"
        v-for="(item, index) in radioOpts"
        :key="index"
        @change="handleChange"
      >
        <el-radio
          v-model="tThis[formDataConName][radioName]"
          :label="item.labelVal + ''"
          :disabled="isDisabled"
        >
          {{ item.labelText }}
        </el-radio>
      </div>
    </div>
    <div class="input-item">
      <el-input
        v-model="tThis[formDataConName][inputValue]"
        :placeholder="inputPlaceholder ? inputPlaceholder : '请输入'"
        size="small"
        class="input"
        :style="'width: ' + inputWidth + ';'"
        :disabled="isDisabled"
      ></el-input>
    </div>
  </div>
</template>

<script>
export default {
  components: {},
  props: {
    //单选部分
    labelName: {
      type: String,
    },
    radioName: {
      type: String,
    },
    isSingle: {
      type: String,
    },
    radioOpts: {
      type: Array,
    },
    tThis: {
      type: Object,
    },
    radioItemWidth: {
      type: String,
    },
    labelWidth: {
      type: String,
    },
    isNeed: {
      type: String,
    },
    //输入部分
    inputValue: {
      type: String,
    },
    inputWidth: {
      type: String,
      default: "100px;",
    },
    formDataConName: {
      type: String,
      default: "formData",
    },
    inputPlaceholder: {
      type: String,
      default: "请输入",
    },
    isDisabled: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {};
  },
  mounted() {},
  methods: {
    //改变
    handleChange() {
      this.$emit("radioValueChange");
      //清空输入
      this.tThis[this.formDataConName][this.inputValue] = "";
    },
  },
};
</script>

<style lang="scss" scoped>
// @import '~styles/mixins.scss';
// @import '~styles/variables.scss';

.dbl-input {
  display: flex;
  flex-direction: row;
  .input-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    .radio-box {
    }
  }
}
</style>